<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="keywords" content="登录">
    <meta name="description" content="用来进行登录和注册">
    <title>我是表单</title>
    <style>
      .login-box {
        width:300px;
        margin:100px auto;
        padding:30px;
        border-radius:3px;
        box-shadow:0 0 5px;
      }
      .login-box h2 {
        text-align:center;
        color:white;
        margin-top:0;
        width:100%;
        background-color:#0099ff;
      }
      .login-a {
        border-radius:3px;
        margin-top:0;
      }
      .input-wrap {
        position:relative;
        margin-bottom:14px;
        background-size:60px 60px;
      }        
      .login-box input {
        width:90%;
        margin-bottom:20px;
        border-radius:2px;
        padding:10px;
      }
      .login-box button {
        color:white;
        border:none;
        margin-bottom:20px;
        width:100%;
        padding:6px;
        border-radius:5px;
      }
      .login-btn {
        background-color:#0099ff;
      }
      .register-btn {
        background-color:#ff5722;
      }
      .eye-icon {
        position:absolute;
        right:10PX;
        background:url("imgs/u_s1.png") no-repeat center;
        width:40px;
        height:40px;
        background-size:contain;
      }
      
    </style>
  </head>
  <body>
    <div class="login-box">
      <h2 class="login-a">登录</h2>
      <input type="text" placeholder="请输入用户名/邮箱/电话">
      <div class="input-wrap">
      <input type="text" placeholder="请输入密码">
      <span class="eye-icon"></span>
      </div>
      <button class="login-btn">用户登录</button>
      <button class="register-btn">没有账户？立即注册</button>
    </div>
  </body>
</html>